// 页面滚动显示隐藏 点击顶部回到顶部
$(function () {
    $(window).on('scroll', function () {
        $('.xtx-product-info').offset().top < $(window).scrollTop() ? $('.sticky').addClass('show') && $('.backTop').show() : $('.sticky').removeClass('show') && $('.backTop').hide()
    })
    $('.backTop').on('click', function () {
        $(window).scrollTop(0)
    })
})

// 点击添加边框
$(function () {
    $('#color img').on('click', function () {
        $('#color img').css('borderColor', 'transparent')
        $(this).css('borderColor', '#27BA9B')
    })
    $('.size').on('click', function () {
        $('.size').css('borderColor', 'transparent')
        $(this).css('borderColor', '#27BA9B')
    })
    $('.tab-head a').on('click', function () {
        $(this).parents('.cont').find('.tab-pane').css('display', 'none')
        $(this).addClass('active').parents('.cont').find('.tab-pane').eq($(this).index()).css('display', 'block')
        $(this).siblings().removeClass('active')
    })
    $('.small li').on('mouseenter', function () {
        $('.small li').removeClass('active')
        $(this).addClass('active').parents('.pictrue').find('.middle img').attr('src', $('.small .active img').attr('src'))
    })
    $('.middle').on('mouseenter', function () {
        $('.large').css('display', 'block')
        $('.large').css('backgroundImage', `url(${$('.small .active img').attr('src')})`)
        $('.layer').css('display', 'block')
    })
    $('.middle').on('mouseleave', function () {
        $('.large').css('display', 'none')
        $('.layer').css('display', 'none')
    })
    $('.middle').on('mousemove', function (e) {
        let x = e.pageX - $('.pictrue').offset().left
        let y = e.pageY - $('.pictrue').offset().top
        if (x > 300) x = 300
        if (x < 100) x = 100
        if (y > 300) y = 300
        if (y < 100) y = 100
        $('.layer').css('top', y + 'px')
        $('.layer').css('left', x + 'px')
        $('.large').css('backgroundPosition', `${-2 * (x - 100)}px ${-2 * (y - 100)}px`)
    })
    // 点击+ 值++ -就--
    let num = Number($('.num input').val())
    if (num === 1) {
        // console.log($('.num a').eq($('.num a').index()))
        $('.num a').eq($('.num a').index()).addClass('disabled')
    }
    $('.num a').on('click', function () {
        if ($(this).text() === '+') {
            $('.num a').removeClass('disabled')
            num++
            $('.num input').val(num)
        }
        if ($(this).text() === '-') {
            if (num === 1) return
            num--
            $('.num input').val(num)
            if (num === 1) {
                $('.num a').addClass('disabled')
                return
            }
        }
        // console.log($(this).eq($('.num a').index()).text() === '-')
        // console.log($(this).eq($('.num a').index()).text() === '+')
        // $(this).text() === '+' ? num++ && $('.num input').val(num) : num-- && $('.num input').val(num)
    })
})